<template>
    <div class="page-scan">
        <van-button @click="scanBarcode('EAN13')" type="primary" size="mini">条形码</van-button>
        <van-button @click="scanBarcode('QR')" type="primary" size="mini">二维码</van-button>
        <van-button @click="scanBarcode('and')" type="primary" size="mini">扫描头</van-button>
        <div class="content"></div>
    </div>
</template>
<script>
var main, receiver, filter
var _codeQueryTag = false
export default {
    name: 'ScanBarcode',
    data() {
        return {}
    },
    created() {
        this.initScan()
        this.startScan()
    },
    mounted() {},
    destroyed() {
        this.stopScan()
    },
    methods: {
        initScan() {
            let _this = this
            main = plus.android.runtimeMainActivity()
            var IntentFilter = plus.android.importClass('android.content.IntentFilter')
            filter = new IntentFilter()
            filter.addAction("android.intent.ACTION_DECODE_DATA")
            receiver = plus.android.implements('io.dcloud.feature.internal.reflect.BroadcastReceiver', {
                onReceive: function (context, intent) {
                    plus.android.importClass(intent)
                    let code = intent.getStringExtra("barcode_string")
                    _this.queryCode(code)
                }
            })
        },
        startScan() {
            main.registerReceiver(receiver, filter)
        },
        stopScan() {
            main.unregisterReceiver(receiver)
        },
        queryCode: function (code) {
            if (_codeQueryTag) return false
            _codeQueryTag = true
            setTimeout(function () {
                _codeQueryTag = false
            }, 150)
            var id = code
            this.$emit('scanBarcodeVal', id)
        },
        scanBarcode(v) {
            if (v == 'and') {
                Toast({
                    message: '扫描头扫码请点击物理按键',
                    position: 'top',
                })
                return
            }
            this.scanCode({
                onlyFromCamera: true,
                type: v,
                success: async (res) => {
                    this.$emit('scanBarcodeVal', res.result || res)
                },
                fail(e) {
                    uni.showToast({
                        icon: "none",
                        title: "扫码失败"
                    })
                }
            })
        },
        clickIndexLeft() {
            this.$router.back()
        },
        scanCode(option) {
            if (!window.plus) return
            let isFlash = false
            const webview = plus.webview.open('', 'webview', {
                top: '0px',
                width: '100%',
                height: '100%',
                backButtonAutoControl: "close",
                titleNView: {
                    backgroundColor: 'rgba(0, 0, 0, 0.5)',
                    autoBackButton: true,
                    titleColor: '#ffffff',
                    titleText: "扫码"
                }
            })
            const barcode = plus.barcode.create('barcode', [plus.barcode[option.type]], {
                top: 'auto',
                left: '0',
                width: '100%',
                height: '100%',
                position: 'static',
                scanbarColor: '#f1c01f',
                frameColor: '#c0ff01'
            })
            const bFlash = new plus.nativeObj.View('nbutton', {
                bottom: '20px',
                left: option.onlyFromCamera ? '30%' : '5%',
                width: '40%',
                height: '44px'
            }, [{
                tag: 'rect',
                id: 'rect',
                rectStyles: {
                    radius: '8px',
                    color: 'rgba(0,0,0,0.5)'
                }
            }, {
                tag: 'font',
                id: 'text',
                text: '闪光灯',
                textStyles: {
                    color: '#FFFFFF'
                }
            }])
            const bAlbum = (!option.onlyFromCamera) && new plus.nativeObj.View('nbutton', {
                bottom: '20px',
                left: '55%',
                width: '40%',
                height: '44px'
            }, [{
                tag: 'rect',
                id: 'rect',
                rectStyles: {
                    radius: '8px',
                    color: 'rgba(0,0,0,0.5)'
                }
            }, {
                tag: 'font',
                id: 'text',
                text: '相册',
                textStyles: {
                    color: '#FFFFFF'
                }
            }])
            bFlash.addEventListener('touchend', (e) => {
                isFlash = !isFlash
                isFlash && bFlash.drawText("闪光灯", null, {color: "#00ccff"}, 'text')
                !isFlash && bFlash.drawText("闪光灯", null, {color: "#ffffff"}, 'text')
                barcode.setFlash(isFlash)
            }, false)
            !option.onlyFromCamera && bAlbum.addEventListener('touchend', (e) => {
                plus.gallery.pick((path) => {
                    plus.barcode.scan(path, barcode.onmarked, barcode.onerror)
                }, barcode.onerror)
            }, false)
            webview.addEventListener("close", () => {
                barcode.close()
                bFlash.close()
                bAlbum && bAlbum.close()
            })
            barcode.onmarked = async (type, code, file, charset) => {
                webview.close()
                await option.success(code)
            }
            barcode.onerror = async (error) => {
                webview.close()
                await option.fail(error)
            }
            plus.webview.getWebviewById('webview').append(barcode)
            plus.webview.getWebviewById('webview').append(bFlash)
            !option.onlyFromCamera && plus.webview.getWebviewById('webview').append(bAlbum)
            barcode.start({
                vibrate: true
            })
        }
    }
}
</script>
<style scoped lang="scss">
.scan-index-bar {
    background-image: linear-gradient(-45deg, #42a5ff, #59cfff);
}
/deep/ .van-nav-bar__title {
    color: #fff !important;
}
.scan-video {
    height: 80vh;
}
.scan-tip {
    width: 100vw;
    text-align: center;
    margin-bottom: 10vh;
    color: white;
    font-size: 5vw;
}
.wp_btn {
    margin-top: 5px;
    text-align: center;
    padding: 0 10px;
}
</style>
